<template>
  <div class="container">
    <van-nav-bar>
      <template #left>
        <i class="iconfont icon-zuojiantou" style="font-size:0.5rem; color:#ffffff" @click="goMore"></i>
        <span style="color:#ffffff;margin-left:5px">新增缴费账户</span>
      </template>
      <template #right>
        <van-icon name="location-o" size="18" color="#fff5f6" />
      </template>
    </van-nav-bar>
    <div class="title" style="margin:10px 5px">
        <!-- <van-icon name="fire-o" size="20" color="#fe6d6d" /> -->
        <van-icon name="fire" size="20" color="#fe6d6d"/>
    <span style="font-size: 14px;margin: 5px;">燃气费</span>
    </div>
     <!-- 缴费页面 -->
    <van-form @submit="Submit">
      <van-cell-group inset >
        <van-field
          v-model="num"
          name="缴费单位"
          label="缴费单位"
          placeholder="北京市燃气集团"
          :rules="[{ required: true, message: '请填写缴费单位' }]"
        />
        <van-field
          v-model="number"
          name="客户编号"
          label="客户编号"
          placeholder="请输入客户编号"
          :rules="[{ required: true, message: '请填写客户编号' }]"
        />
        <!-- <van-button type="default" size="mini" style="border:none">如何查户号</van-button> -->
      </van-cell-group>
      <van-checkbox v-model="checked" style="width:190px;font-size: 10px;margin-top: 10px;padding-left:10px;" icon-size="12px">同意《宜居自助缴费协议》</van-checkbox>
      <!-- <span style="font-size:14px;">如何查户号</span> -->
      <div style="margin: 10px">
        <van-button round block color="#ff5555"> 下一步 </van-button>
      </div>
    </van-form>
  </div>
</template>

<script>
export default {
    data() {
    return {
      checked: true,
      num: '',
      number: '',
    };
  },
  methods: {
    Submit(values) {
      console.log('submit', values);
    },
    goMore(){
      this.$router.push({path: "/more"})
    }
  },
}
</script>

<style lang="less" scoped>
    .van-nav-bar {
  background: #ff5555;
}
/deep/.van-nav-bar__left{
  padding: 0 5px;
}
/deep/.van-nav-bar .van-icon {
    color: #fff5f6;
    
}
/deep/.van-nav-bar__text {
    color: #fff5f6;
}

</style>